<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <meta http-equiv="pragma" content="no-cache" />
    <meta http-equiv="cache-control" content="no-cache" />
    <title>Baseline dash.js Player</title>
    <meta name="description" content="" />

    <script>
        var player = null;
        var video = null;
        var mssPackage = null;
        function getURLParameter(name) {
            return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
        }
        mssPackage = getURLParameter('mss');
        var scriptTagDashjs = document.createElement('script');
        scriptTagDashjs.type = "application/javascript";
        scriptTagDashjs.src = "../../dist/dash.all.debug.js";

        document.head.appendChild(scriptTagDashjs);
        scriptTagDashjs.onload = function(){
            if (mssPackage) {
                var scriptTagMss = document.createElement('script');
                scriptTagMss.type = "application/javascript";
                scriptTagMss.src = "../../dist/dash.mss.debug.js";
                document.head.appendChild(scriptTagMss);
            }
        };
        function loadVideo() {
            if (!player) {
                video = document.querySelector(".dash-video-player video");
                player = dashjs.MediaPlayer().create();
                player.initialize(video, null, true);
                player.setMute(true);
                player.setAutoPlay(true);
            }
        }
        function initVideo() {
            loadVideo();
        }
    </script>

    <style>
        video {
            width: 640px;
            height: 480px;
        }
    </style>

    <body onload="initVideo()">
        <div class="dash-video-player">
            <video controls="true"></video>
        </div>
    </body>

</html>
